{% extends 'layout.html' %}

{% block title %}{{ document._id|stringDocIDs|to_string }}{% endblock %}


{% block styles %}

  <style type="text/css">
    .CodeMirror-scroll {
      height: auto;
      overflow-y: hidden;
      overflow-x: auto;
      width: 100%;
    }
    .CodeMirror {
      height: auto;
    }
  </style>
{% endblock %}


{% block breadcrumb %}
<li class="nav-item">
  <a class="nav-link px-1" href="{{ dbUrl }}">Database:</a>
</li>
<li class="nav-item dropdown">
  <a class="nav-link dropdown-toggle px-1" href="#" role="button" aria-controls="navbarDatabaseDropdown" data-bs-target="#navbarDatabaseDropdown" data-bs-toggle="dropdown" aria-expanded="false">
    {{ dbName }}
  </a>
  <ul id="navbarDatabaseDropdown" class="dropdown-menu scrollable-ul">
    {% for db in databases %}
    <li><a class="dropdown-item" href="{{ baseHref }}db/{{ db | url_encode }}/">{{ db }}</a></li>
    {% endfor %}
  </ul>
</li>
<li class="nav-item">
  <a class="nav-link px-1" href="{{ collectionUrl }}">Collection:</a>
</li>
<li class="nav-item dropdown">
  <a class="nav-link dropdown-toggle px-1" href="#" role="button" aria-controls="navbarCollectionDropdown" data-bs-target="#navbarCollectionDropdown" data-bs-toggle="dropdown" aria-expanded="false">
    {{ collectionName }}
  </a>
  <ul id="navbarCollectionDropdown" class="dropdown-menu scrollable-ul">
    {% for collection in collections %}
    <li><a class="dropdown-item" href="{{ dbUrl }}/{{ collection | url_encode }}">{{ collection }}</a></li>
    {% endfor %}
  </ul>
</li>
<li class="nav-item">
  <a class="nav-link disabled">Document {{ document._id|stringDocIDs }}</a>
</li>
{% endblock %}

{% block content %}

{% if document._id._bsontype == 'Binary' %}
<form method="POST"
  id="documentEditForm"
  action="{{ collectionUrl }}/{{ document._id | json | safe | url_encode }}?subtype={{ document._id.sub_type }}&skip={{skip}}"
>
{% elseif document._id._bsontype == 'Long' %}
<form method="POST"
  id="documentEditForm"
  action="{{ collectionUrl }}/{{ document._id | longToString | safe | url_encode }}?skip={{skip}}"
>
{% else %}
<form method="POST"
  id="documentEditForm"
  action="{{ collectionUrl }}/{{ document._id | json | safe | url_encode }}?skip={{skip}}"
>
{% endif %}
  <input type="hidden" name="_csrf" value="{{ csrfToken }}">
  {% if docLength > 10 %}
    <div>
      {% if !settings.read_only %}
        <input type="hidden" name="_method" value="put">
        <button onclick="return onBackClick()" class="backButton btn btn-warning btn-large">
         <i class="fa fa-arrow-left"></i>
          Back
        </button>
        <button type="submit" class="btn btn-success btn-large float-end" onclick="return onSubmitClick()">
          <i class="fa fa-save"></i>
          Save
        </button>
      {% else %}
        <button onclick="return history.back()" class="btn btn-warning btn-large btn-block">
          <i class="fa fa-arrow-left"></i>
          Back
        </button>
      {% endif %}
    </div>
  <br />
  {% endif %}

  <textarea class="col-md-12" id="document" name="document"{% if settings.read_only %} readonly="readonly"{% endif %}>{{ docString }}</textarea>
  <br />

  <div>
    {% if !settings.read_only %}
      <input type="hidden" name="_method" value="put">
      <button onclick="return onBackClick()" class="backButton btn btn-warning btn-large">
        <i class="fa fa-arrow-left"></i>
        Back
      </button>

      <button type="submit" class="btn btn-success btn-large float-end" onclick="return onSubmitClick()">
        <i class="fa fa-save"></i>
        Save
      </button>
    {% else %}
      <button onclick="return history.back()" class="btn btn-warning btn-large btn-block">
        <i class="fa fa-arrow-left"></i>
        Back
      </button>
    {% endif %}
  </div>
</form>

{% if !settings.read_only && !settings.no_delete %}
  <br>

  {% if document._id._bsontype == 'Binary' %}
  <form method="POST" action="{{ collectionUrl }}/{{ document._id | json | safe | url_encode }}?subtype={{ document._id.sub_type }}">
  {% elseif document._id._bsontype == 'Long' %}
  <form method="POST" action="{{ collectionUrl }}/{{ document._id | longToString | safe | url_encode }}">
  {% else %}
  <form method="POST" action="{{ collectionUrl }}/{{ document._id | json | safe | url_encode }}">
  {% endif %}
    <input type="hidden" name="_csrf" value="{{ csrfToken }}">
    <input type="hidden" name="_method" value="delete">
    <button type="submit" class="btn btn-danger deleteButtonDocument">
      <i class="fa fa-trash"></i>
      Delete
    </button>
  </form>

  <div class="modal fade" id="confirm-document-delete" tabindex="-1" aria-hidden="true">
    <div class="modal-dialog">
      <div class="modal-content">
        <div class="modal-body">
          Are you sure?
        </div>
        <div class="modal-footer">
          <button type="button" data-dismiss="modal" class="btn btn-danger" id="delete">Delete</button>
          <button type="button" data-dismiss="modal" class="btn">Cancel</button>
        </div>
      </div>
    </div>
  </div>

{% endif %}

{% endblock %}


{% block scripts %}
<script src="{{ baseHref }}{{ assets.codemirror.js }}"></script>
<script src="{{ baseHref }}{{ assets.document.js }}"></script>
{% endblock %}
